* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

/* loading indicator */
/* yep, I know it is off-center, but I dont want to figure out the right origin */
@-moz-keyframes rotation {
  from {
    -moz-transform: rotate(0deg);
    -moz-transform-origin: 85% 90%;
  }
  to {
    -moz-transform: rotate(359deg);
    -moz-transform-origin: 85% 90%;
  }
}

@-webkit-keyframes rotation {
  from {
    -webkit-transform: rotate(0deg);
    -webkit-transform-origin: 85% 90%;
  }
  to {
    -webkit-transform: rotate(359deg);
    -webkit-transform-origin: 85% 90%;
  }
}

[class*=" icon-"].loading-indicator {
  float: left;
  display: none;
  font-size: 24px;
  margin: 7px;
  color: #ec173a;
}

[class*=" icon-"].loading-indicator.on {
  display: block;
  -webkit-animation: rotation 1.5s infinite linear;
  -moz-animation: rotation 1.5s infinite linear;
}

/* browser alert */
.browser-warning {
  display: none;
}

/* user List*/
.user-list {
  padding: 9px 0;
}

.user .icon-phone-4 {
  display: none;
}

.user:hover .icon-phone-4 {
  display: inline-block;
}

.user a {
  position: relative;
  overflow: hidden;
}

.user .username {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  padding-right: 16px;
}

.user .helper {
  position: absolute;
  right: 10px;
  top: 5px;
}

/* in call actions */
.actions {
  display: none;
}

[data-mode="incall"] .actions,
[data-mode="calling"] .actions {
  display: block;
}

.actions .hangup {
  width: 100%;
}

.actions .status {
  text-align: center;
  margin-bottom: 20px;
}

/* video windows */
.video {
  height: 100%;
  width: 100%;
  border: 2px solid black;
}

.cool-background {
  background: linear-gradient(135deg, #eceddc 25%, transparent 25%) -50px 0,
    linear-gradient(225deg, #eceddc 25%, transparent 25%) -50px 0,
    linear-gradient(315deg, #eceddc 25%, transparent 25%),
    linear-gradient(45deg, #eceddc 25%, transparent 25%);
  background-size: 100px 100px;
  background-color: #ec173a;
}

/* alertify styles */
.alertify-cover {
  background: rgba(0, 0, 0, 0.8);
}
